<template>
  <view>
    <view class="goods-list">
      <block v-for="(goods, i) in goodsList" :key="i"><my-goods :goods="goods"></my-goods></block>
    </view>
  </view>
</template>

<script>
import { debounce } from 'lodash';
export default {
  name: 'GoodsListPage',
  components: {},
  data() {
    return {
      // 查询的参数
      queryObj: {
        query: '', // 搜索关键字
        cid: '', // 分类id
        pagenum: 1, // 当前页码
        pagesize: 10 // 每页多少条
      },
      // 商品列表
      goodsList: [],
      // 总记录条数
      total: 0
    };
  },
  created() {},
  mounted() {},
  onLoad(options) {
    options.query && (this.queryObj.query = options.query);
    options.cid && (this.queryObj.cid = options.cid);
    this.getGoodsList();
  },
  // 下拉刷新
  async onPullDownRefresh(){
    this.queryObj.pagenum = 1
    this.total = 0
    this.goodsList= []
    await this.getGoodsList()
    uni.stopPullDownRefresh()
  },
  // 上拉触底
  onReachBottom() {
    this.getGoodsList();
  },
  methods: {
    getGoodsList: debounce(async function() {
      // 判断数据是否加载完
      if (this.goodsList.length === this.total && this.total !== 0) return;
      let {
        data: {
          message,
          meta: { status }
        }
      } = await uni.$http.get('/api/public/v1/goods/search', this.queryObj);
      if (status !== 200) {
        return uni.$showMsg();
      }
      // 合并数组
      this.goodsList = [...this.goodsList, ...message.goods];
      // 当前页面值+1
      this.queryObj.pagenum++;
      this.total = message.total;
    }, 1000)
  }
};
</script>

<style lang="scss"></style>
